/*
    弹框
    @param{string} title
    @param{string} content
    @param{string} certain 
    @param{Function} function
    @param{string} cancel
    @param{Function} function
*/
function confirm(_title, _certain, certainCallbeck, _cancel, cancelCallback) {
    if (!_title) return;
    var commonBoxShadow = document.createElement('div');
    commonBoxShadow.className = 'commonBoxShadow';
    $(commonBoxShadow).css({
        'position': 'fixed',
        'width': '100%',
        'height': '100%',
        'top': 0,
        'left': 0,
        'background': 'rgba(0,0,0,.4)'
    })
    var commonBox = document.createElement('div');
    commonBox.className = 'commonBox';
    $(commonBox).css({
        'position': 'absolute',
        'top': '42%',
        'left': '50%',
        'width': '80%',
        'background': '#fff',
        'border-radius': '8px',
        'padding': '14px',
        'transform': 'translate(-50%,-50%)',
        'min-height': '150px'
    })
    var title = document.createElement('p');
    title.innerHTML = _title;
    $(title).css({
            'font-size': '16px',
            'text-align': 'center',
            'line-height': '20px',
            'margin-top': '40px'
        })
        // var content = document.createElement('p');
    var btnBox = document.createElement('div');
    $(btnBox).css({
        'position': 'absolute',
        'bottom': '30px',
        'width': '100%',
        'left': '0',
        'display': 'flex',
        'justify-content': 'space-around'
    })
    var certainBtn = document.createElement('div');
    $(certainBtn).css({
        'display': 'inline-block',
        'width': '40%',
        'background': 'blue',
        'height': '30px',
        'line-height': '30px',
        'text-align': 'center',
        'color': '#fff',
        'font-size': '14px',
        'border-radius': '8px'
    });
    certainBtn.innerHTML = _certain;

    certainBtn.onclick = function() {
        $(commonBoxShadow).hide(1000).remove();
        if (certainCallbeck && certainCallbeck instanceof Function) {
            certainCallbeck();
        }
    }

    $(commonBox).append(title);
    // $(commonBox).append(content);
    $(commonBox).append(btnBox);
    $(btnBox).append(certainBtn);
    if (_cancel) {
        var cancelBtn = document.createElement('div');
        cancelBtn.innerHTML = _cancel;
        $(cancelBtn).css({
            'display': 'inline-block',
            'width': '40%',
            'background': '#b9b8b8',
            'height': '30px',
            'line-height': '30px',
            'text-align': 'center',
            'color': '#000',
            'font-size': '14px',
            'border-radius': '8px'
        });
        $(btnBox).append(cancelBtn);

        cancelBtn.onclick = function() {
            $(commonBoxShadow).hide(1000).remove();
            if (cancelCallback && cancelCallback instanceof Function) {
                cancelCallback();
            }
        }
    }

    $(commonBoxShadow).append(commonBox);

    $('body').append(commonBoxShadow)
}